{% block sw_bulk_edit_customer %}
<sw-page class="sw-bulk-edit-customer">
    {% block sw_bulk_edit_customer_search_bar %}
    <template #search-bar>
        <sw-search-bar />
    </template>
    {% endblock %}

    {% block sw_bulk_edit_customer_smart_bar_header %}
    <template #smart-bar-header>
        <h2>{{ $tc('sw-bulk-edit.customer.textTitle', { customerTotal: selectedIds.length }), selectedIds.length }}</h2>
    </template>
    {% endblock %}

    {% block sw_bulk_edit_customer_content_language_switch %}
    <template #language-switch>
        <sw-language-switch @on-change="onChangeLanguage" />
    </template>
    {% endblock %}

    {% block sw_bulk_edit_customer_content_smart_bar_actions %}
    <template #smart-bar-actions>
        {% block sw_bulk_edit_customer_actions_save %}
        <sw-button-process
            class="sw-bulk-edit-customer__save-action"
            variant="primary"
            :is-loading="isLoading"
            :process-success="false"
            :disabled="isLoading || !hasChanges"
            @click="openModal"
        >
            {{ $tc('sw-bulk-edit.applyChanges') }}
        </sw-button-process>
        {% endblock %}
    </template>
    {% endblock %}

    {% block sw_bulk_edit_customer_content %}
    <template #content>
        <sw-card-view
            v-if="selectedIds.length > 0 && isLoadedData"
        >
            {% block sw_bulk_edit_customer_content_account_card %}
            <mt-card
                class="sw-bulk-edit-customer-base__account"
                position-identifier="sw-bulk-edit-customer-account"
                :title="$tc('sw-bulk-edit.customer.account.cardTitle')"
                :is-loading="isLoading"
            >
                <template #grid>
                    {% block sw_bulk_edit_customer_content_account_section %}
                    <sw-bulk-edit-change-type-field-renderer
                        :form-fields="accountFormFields"
                        :bulk-edit-data="bulkEditData"
                        :entity="customer"
                    />
                    {% endblock %}
                </template>
            </mt-card>
            {% endblock %}

            {% block sw_bulk_edit_customer_tags_card %}
            <mt-card
                class="sw-bulk-edit-customer-base__tags"
                position-identifier="sw-bulk-edit-customer-tags"
                :title="$tc('sw-bulk-edit.customer.tags.cardTitle')"
                :is-loading="isLoading"
            >
                <template #grid>
                    {% block sw_bulk_edit_customer_tags %}
                    <sw-bulk-edit-change-type-field-renderer
                        :form-fields="tagsFormFields"
                        :bulk-edit-data="bulkEditData"
                        :entity="customer"
                    />
                    {% endblock %}
                </template>
            </mt-card>
            {% endblock %}

            {% block sw_bulk_edit_customer_custom_field_card %}
            <mt-card
                v-if="customFieldSets.length > 0"
                class="sw-bulk-edit-customer-base__custom_fields"
                position-identifier="sw-bulk-edit-customer-custom-field"
                :title="$tc('sw-bulk-edit.customer.customFields.cardTitle')"
                :is-loading="isLoading"
            >
                <template #grid>
                    <sw-bulk-edit-custom-fields
                        class="sw-bulk-edit__custom-fields"
                        :sets="customFieldSets"
                        @change="onCustomFieldsChange"
                    />
                </template>
            </mt-card>
            {% endblock %}
        </sw-card-view>

        {% block sw_bulk_edit_customer_empty_state %}
        <sw-empty-state
            v-if="selectedIds.length <= 0 && !isLoading"
            :title="$tc('sw-bulk-edit.customer.messageEmptyTitle')"
            :subline="$tc('sw-bulk-edit.customer.messageEmptySubline')"
        />
        {% endblock %}

        {% block sw_bulk_edit_customer_save_modal %}
        <router-view
            v-slot="{ Component }"
        >
            <component
                :is="Component"
                :item-total="selectedIds.length"
                :is-loading="isLoading"
                :process-status="processStatus"
                :bulk-edit-data="bulkEditData"
                @modal-close="closeModal"
                @bulk-save="onSave"
            />
        </router-view>
        {% endblock %}
    </template>
    {% endblock %}
</sw-page>
{% endblock %}
